import React, { Component } from 'react'
import { View, Text, TouchableOpacity } from 'react-native'
import { Container, Content } from 'native-base'
import commonStyle from '../../libs/commonStyle'
import Iconfont from '../../components/iconfont'
import { connect } from 'react-redux' // 引入connect函数
import * as loginAction from '../../redux/actions/login'

class Login extends Component {
	async _onLogin() {
		this.props.onLogin()
	}
	// 回退刷新api的isLogin状态
	render() {
		const { loginInfo } = this.props
		return (
			<Container>
				<Content>
					<View
						style={[
							commonStyle.flexCenter,
							commonStyle.flexItem,
							commonStyle.flexColumn,
							commonStyle.backgroundColorWhite,
							commonStyle.windowHeight
						]}
					>
						<Text
							style={[commonStyle.f40, commonStyle.activeColor]}
						>
							发新闻，赚现金，秒到账！
						</Text>
						<TouchableOpacity onPress={this._onLogin.bind(this)}>
							<View
								style={[
									commonStyle.flexCenter,
									commonStyle.mt100
								]}
							>
								<Iconfont
									name="weixin2"
									size={120}
									color="#66CC00"
								/>
								<Text
									style={[commonStyle.f32, { color: '#333' }]}
								>
									无需注册，微信一键登录
								</Text>
							</View>
						</TouchableOpacity>
						{/* {!loginInfo.isSuccess && loginInfo.errMsg && (
              <Text style={[commonStyle.pt20, commonStyle.activeColor, commonStyle.f24]}>
                {JSON.stringify(loginInfo.errMsg)}
              </Text>
            )} */}
					</View>
				</Content>
			</Container>
		)
	}
}

export default connect(
	state => ({
		loginInfo: state.login
	}),
	dispatch => ({
		onLogin: () => dispatch(loginAction.login())
	})
)(Login)
